import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:share_fit/app/components/single_picker.dart';
import 'package:share_fit/app/helper/ext/tr_ext.dart';
import 'package:share_fit/app/tools/color_const.dart';
import 'package:share_fit/generated/locales.g.dart';

import 'hr_warning_logic.dart';

class HrWarningPage extends StatelessWidget {
  //心率告警页面
  HrWarningPage({super.key});

  final logic = Get.put(HrWarningLogic());
  final state = Get.find<HrWarningLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ColorConst.mainBgColor,
      appBar: AppBar(
        title: Text(LocaleKeys.settings_hr_warning.ts),
        centerTitle: true,
      ),
      body: Padding(
        padding: EdgeInsets.only(left: 40.w, top: 80.h, right: 40.w),
        child: ListView(
          children: [
            Container(
              height: 247.h,
              padding: EdgeInsets.only(left: 59.w, top: 10.h, right: 36.w),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(20),
              ),
              child: Column(
                children: [
                  Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          LocaleKeys.settings_hr_warning.ts,
                          style: TextStyle(
                              fontSize: 42.sp,
                              color: ColorConst.primaryFontColor),
                        ),
                        Expanded(child: Container()),
                        Transform.scale(
                          scale: 0.7,
                          child: Obx(() => CupertinoSwitch(
                              value: state.isContinuousHeartRate.value,
                              activeColor: ColorConst.accentColor,
                              onChanged: (value) {
                                logic.setContinuousHeartRateEnable(value);
                              })),
                        )
                      ]),
                  Obx(()=>Offstage(
                    offstage: state.isContinuousHeartRate.value,
                    child: Container(
                      alignment: Alignment.centerLeft,
                      child: Text(
                        LocaleKeys.settings_hr_warning_tips.ts,
                        style: TextStyle(
                            fontSize: 36.sp,
                            color: ColorConst.secondaryFontColor),
                      ),
                    ),
                  ))
                ],
              ),
            ),
            SizedBox(height: 40.h),
            Container(
              height: 350.h,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(20),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  InkWell(
                    child: Container(
                      padding: EdgeInsets.only(left: 59.w, right: 36.w),
                      alignment: Alignment.centerLeft,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            LocaleKeys.settings_hr_warning_max.ts,
                            style: TextStyle(
                                fontSize: 42.sp,
                                color: ColorConst.primaryFontColor),
                          ),
                          Expanded(child: Container()),
                          Obx(() => Text(
                                state.maxHeartRate.value.toString(),
                                style: TextStyle(
                                    fontSize: 42.sp,
                                    color: ColorConst.primaryFontColor),
                              )),
                          SizedBox(width: 40.w),
                          const Icon(
                            Icons.arrow_forward_ios,
                            size: 14,
                          ),
                        ],
                      ),
                    ),
                    onTap: () {
                      _showPicker(
                          context,
                          LocaleKeys.settings_hr_warning_max.ts,
                          true,
                          state.maxHeartRate.value);
                    },
                  ),
                  Container(
                    width: double.infinity,
                    height: 1.h,
                    decoration: const BoxDecoration(
                      color: Colors.grey,
                    ),
                  ),
                  InkWell(
                    child: Container(
                      padding: EdgeInsets.only(left: 59.w, right: 36.w),
                      alignment: Alignment.centerLeft,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            LocaleKeys.settings_hr_warning_min.ts,
                            style: TextStyle(
                                fontSize: 42.sp,
                                color: ColorConst.primaryFontColor),
                          ),
                          Expanded(child: Container()),
                          Obx(() => Text(
                                state.minHeartRate.value.toString(),
                                style: TextStyle(
                                    fontSize: 42.sp,
                                    color: ColorConst.primaryFontColor),
                              )),
                          SizedBox(width: 40.w),
                          const Icon(
                            Icons.arrow_forward_ios,
                            size: 14,
                          ),
                        ],
                      ),
                    ),
                    onTap: () {
                      _showPicker(
                          context,
                          LocaleKeys.settings_hr_warning_min.ts,
                          false,
                          state.minHeartRate.value);
                    },
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  _showPicker(BuildContext context, title, isMax, initValue) {
    List listData = isMax ? state.maxHeartRateData : state.minHeartRateData;
    SinglePicker.showPicker(
        context, title, listData, initValue, (index, value) => _onPickerConfirm(isMax, value));
  }

  void _onPickerConfirm(isMax, value) {
    if (isMax) {
      logic.setMaxHeartRate(value);
    } else {
      logic.setMinHeartRate(value);
    }
  }
}
